import { defineComponent } from 'vue'
import { CommonWidgetNames, FiledPropsDefine } from '../types'
import { getWidget } from '../theme'

export default defineComponent({
  name: 'String',
  props: FiledPropsDefine,
  setup(props) {
    const TextWidgetRef = getWidget(CommonWidgetNames.TextWidget)

    const handleChange = (v: string) => {
      props.onChange(v)
    }

    return () => {
      const { value } = props

      const TextWidget = TextWidgetRef.value

      return <TextWidget value={value as any} onChange={handleChange} />
    }
  },
})
